<template>
  <div style="position: relative;width: 600px">
    <p class="flex_center">严重水平</p>
    <div class="flex_between width: 600px;">
      <p class="th2">概率分级</p>
      <table class="table1 owntable" border="0" cellspacing="0" cellpadding="1" width="570">
        <tr>
          <td class="tdx"></td>
          <td>
            <span>S1</span>
            <span>可忽略</span>
          </td>
          <td>
            <span>S2</span>
            <span>轻度</span>
          </td>
          <td>
            <span>S3</span>
            <span>严重</span>
          </td>
          <td>
            <span>S4</span>
            <span>危重</span>
          </td>
          <td>
            <span>S5</span>
            <span>灾难性</span>
          </td>
        </tr>
        <tr>
          <td>
            <span>P5</span>
            <span>经常</span>
          </td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
        </tr>
        <tr>
          <td>
            <span>P4</span>
            <span>有时</span>
          </td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
        </tr>
        <tr>
          <td>
            <span>P3</span>
            <span>偶然</span>
          </td>
          <td>A</td>
          <td>A</td>
          <td>U</td>
          <td>U</td>
          <td>U</td>
        </tr>
        <tr>
          <td>
            <span>P2</span>
            <span>很少</span>
          </td>
          <td>A</td>
          <td>A</td>
          <td>A</td>
          <td>U</td>
          <td>U</td>
        </tr>
        <tr>
          <td>
            <span>P1</span>
            <span>非常少</span>
          </td>
          <td>A</td>
          <td>A</td>
          <td>A</td>
          <td>A</td>
          <td>A</td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script></script>

<style scoped>
.th2 {
  width: 10px;
}
.table1 > tr > td {
  text-align: center;
  width: 80px;
  background: #ffffff !important;
  position: relative;
}
td > span:nth-child(2) {
  margin-left: 10px;
}
.tdx::after {
  content: '';
  position: absolute;
  width: 1px;
  height: 100px;
  top: 0;
  left: 0;
  background-color: #ebeef5;
  transform: rotate(-68deg);
  transform-origin: top;
}
</style>
